<template>
 <div>
   <el-dialog title="提示" width="420px" append-to-body :visible.syn="isResetFlag" @close="close" top="30vh">
     <el-form ref="form" :rules="rules" :model="user" @submit.native.prevent.stop>
       <p>请输入{{ dataForm.userName }}的新密码</p>
       <el-form-item prop="pwd">
         <el-input v-model="user.pwd" placeholder="请输入密码" type="password" show-password @input="(e)=>{pwdInput(e)}"/>
       </el-form-item>
       <div class="btn-box ">
         <el-button type="primary" size="mini" @click="submit">确定</el-button>
         <el-button @click="close" size="mini">取消</el-button>
       </div>
     </el-form>
   </el-dialog>
 </div>
</template>

<script>
import { resetUserPwd } from '@/api/system/user'
import { resetCompanyStaffPwd } from '@/api/basic/staff'
import { resetPwdStaff } from '@/api/hospital/staff'
export default {
  name: 'ResetPwdDialog',
  props: {
    dataForm: {},
    type: String,
    isResetFlag: Boolean
  },
  data() {
    const validatePass = (rule, value, callback) => {
      const regex = new RegExp("((?=.*\\d)(?=.*\\D)|(?=.*[a-zA-Z])(?=.*[^a-zA-Z]))(?!^.*[\u4E00-\u9FA5].*$).{8,32}")
      if(value.length < 8 || value.length > 32) {
        callback(new Error("请输入8~32位密码"));
      }else if (!regex.test(value)) {
        callback(new Error("密码必须同时包含字母、数字、特殊符号中的其中两种"))
      }else {
        callback()
      }
    }
    return{
      user: {
        pwd: 'yk12345678'
      },
      rules: {
        pwd: [
          { required: true, message: "新密码不能为空", trigger: "blur" },
          { required: true, validator: validatePass, trigger: "blur" },
        ]
      }
    }
  },
  // mounted() {
  //   console.log('props', this.$props.dataForm)
  // },
  methods: {
    pwdInput(val) {
      this.user.pwd = val.replace(/[\u4E00-\u9FA5]/g,'')
    },
    submit() {
      this.$refs["form"].validate(valid => {
        if(valid) {
          if(this.$props.type === "companyStaff") {
            resetCompanyStaffPwd(this.$props.dataForm.userId, this.user.pwd).then(res => {
              this.$modal.msgSuccess("修改成功，新密码是：" + this.user.pwd);
              this.$emit('changeFlag', false)
            });
          }else if(this.$props.type === "medicalStaff") {
            resetPwdStaff(this.$props.dataForm.userId, this.user.pwd).then(res => {
              this.$modal.msgSuccess("修改成功，新密码是：" + this.user.pwd);
              this.$emit('changeFlag', false)
            });
          }else {
            resetUserPwd(this.$props.dataForm.userId, this.user.pwd).then(res => {
              this.$modal.msgSuccess("修改成功，新密码是：" + this.user.pwd);
              this.$emit('changeFlag', false)
            });
          }
        }
      })
    },
    close() {
      this.$emit('changeFlag', false)
    }
  },
}
</script>

<style lang="scss" scoped>
::v-deep .el-dialog:not(.is-fullscreen) {
  margin-top: 30vh !important;
}
::v-deep .el-dialog__header {
  border-bottom: 1px solid #ccc;
}
.btn-box {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  margin-top: 40px;
}
</style>
